<template>
<view class="img-box">
    <navigator :url="'/pages/goods/goods?id=' + item.id">
        <image class="img" :src="item.pic"></image>
    </navigator>
    <view class="item">
        <!-- <text class="{{likeFlag?'like':'' }}"data-value-id="{{item.id}}"
            catchtap="like" >{{item.name}}</text> -->
        <text class="l">{{item.name}}</text>
        <view class="r">
            <image class="hot" src="/static/static/images/hot.png"></image>
            <text class="txt">{{item.hot}}</text>
        </view>
    </view>
    
</view>
</template>

<script>

export default {
  data() {
    return {
      likeFlag: false
    };
  },

  components: {},
  props: {
    item: {
      type: Object
    },
    like: {
      type: Boolean
    }
  },
  methods: {
    like: function (event) {
      let id = event.currentTarget.dataset.valueId; // console.log("==img-box like=="+id)

      this.setData({
        likeFlag: !this.likeFlag
      });
      this.$emit("like", {
        detail: id
      });
    }
  }
};
</script>
<style>
.img-box{
    width: 100%;
    margin-bottom: 20px;
}
.img-box .img{
    display: block;
    width: 100%;
    border-radius: 12rpx;
    margin-bottom: 24rpx;
}
.img-box text{
    font-size: 28rpx;
    color: #353535;
    /* flex: 1;
    background: url("http://192.168.3.18:9000/rdzn/like.png") ;
    background-repeat: no-repeat;
    background-position: right;
    background-size: auto;
    padding-right: 60rpx; */
}
.img-box text.like{
    font-size: 28rpx;
    color: #353535;
    /* flex: 1;
    background: url("http://192.168.3.18:9000/rdzn/liked.png") ;
    background-repeat: no-repeat;
    background-position: right;
    background-size: auto;
    padding-right: 60rpx; */
}

.img-box .item{
    display: flex;
    flex-direction: row;
    align-items: center;
    flex-flow: row nowrap;
}
.img-box .item .l{
    margin-left: 5rpx;
    flex: 1;
}
.img-box .item .r{
    margin-left: 10rpx;
    display: flex;
    align-items: center;
}
.img-box .item .r .hot{
    width: 21rpx;
    height: 24rpx;
    margin-right: 8rpx;
}
.img-box .like{
    /* background: url("http://192.168.3.18:9000/rdzn/like.png") 0 center no-repeat; */
    margin-left: 5rpx;
}
.img-box .like.selected{
    /* background: url("http://192.168.3.18:9000/rdzn/liked.png"); */
    width: 42rpx;
    height: 42rpx;
    display: block;
    flex: 0.17;
    margin-left: 5rpx;
}
</style>